<template>
  <svg viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg">
    <defs>
      <linearGradient id="securityGradient" x1="0%" y1="0%" x2="100%" y2="100%">
        <stop offset="0%" style="stop-color:#3b82f6;stop-opacity:1" />
        <stop offset="100%" style="stop-color:#1d4ed8;stop-opacity:1" />
      </linearGradient>
      <filter id="securityGlow">
        <feGaussianBlur stdDeviation="1.5" result="coloredBlur"/>
        <feMerge> 
          <feMergeNode in="coloredBlur"/>
          <feMergeNode in="SourceGraphic"/>
        </feMerge>
      </filter>
    </defs>
    
    <!-- 盾牌外形 -->
    <path d="M 30 10 Q 20 15 15 25 Q 15 35 20 42 Q 25 48 30 50 Q 35 48 40 42 Q 45 35 45 25 Q 40 15 30 10 Z" 
          fill="url(#securityGradient)" filter="url(#securityGlow)"/>
    
    <!-- 内部装饰 -->
    <path d="M 30 15 Q 22 18 18 26 Q 18 34 22 40 Q 26 45 30 47 Q 34 45 38 40 Q 42 34 42 26 Q 38 18 30 15 Z" 
          fill="rgba(255,255,255,0.2)"/>
    
    <!-- 锁图标 -->
    <g transform="translate(30,30)">
      <!-- 锁身 -->
      <rect x="-6" y="-2" width="12" height="8" rx="2" fill="#ffffff"/>
      
      <!-- 锁环 -->
      <path d="M -4 -2 Q -4 -8 0 -8 Q 4 -8 4 -2" stroke="#ffffff" stroke-width="2" fill="none"/>
      
      <!-- 锁孔 -->
      <circle cx="0" cy="2" r="1.5" fill="url(#securityGradient)"/>
    </g>
    
    <!-- 装饰光点 -->
    <circle cx="25" cy="20" r="1" fill="#ffffff" opacity="0.8"/>
    <circle cx="35" cy="25" r="1" fill="#ffffff" opacity="0.6"/>
    <circle cx="22" cy="35" r="1" fill="#ffffff" opacity="0.7"/>
    <circle cx="38" cy="38" r="1" fill="#ffffff" opacity="0.5"/>
  </svg>
</template>

<script setup>
// 安全图标组件
</script>

<style scoped>
svg {
  width: 100%;
  height: 100%;
}
</style>